// productdetail.js
var WxParse = require('../../utils/wxParse/wxParse.js');
//引入图片预加载组件
const ImgLoader = require('../../utils/img-loader/img-loader.js')
var app = getApp()
var host = app.globalData.host
Page({
  data: {
    photoobject: [],
    imgList: [],
    image: app.globalData.image,
    productname: '',
    productprice: '',
    description: '',
    detailscontent: false,
    parametercontent: true,
    left: '0',
    position: '0',
    productbrand: '',
    productnumber: '',
    productcolor: '',
    productsize: '',
    brandname: '',
    parameterother: '',
    check: true,
    checked: false,
    choose: true,
    choosed: false,
    buynumber: 1,
    modal: true,
    buyorcar: '',
    whichcolor: '',
    whichsize: '',
    whichcolorname: '',
    whichsize: '',
    openId: '',
    spuId: '',
    labelfirstshow: true,
    labelsecondshow: true,
    labelthirdshow: true
  },
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    var id = options.id;
    var that = this;
    that.imgLoader = new ImgLoader(this, this.imageOnLoad.bind(this))
    wx.request({
      url: host + '/spuApi/spuProductDetail?id=' + id,
      header: { 'content-type': 'application/json' },
      success: function (res) {
        console.log(res)
        var imgLoadList = new Array()
        imgLoadList[0] = { url: that.data.image + res.data.data.photo }
        imgLoadList[1] = { url: that.data.image + res.data.data.photo1 }
        imgLoadList[2] = { url: that.data.image + res.data.data.photo2 }
        imgLoadList[3] = { url: that.data.image + res.data.data.photo3 }
        imgLoadList[4] = { url: that.data.image + res.data.data.photo4 }

        imgLoadList.forEach(item => {
          that.imgLoader.load(item.url)
          var thumb = item.url.replace(/\/images/, "/_thumbs/images");
          // var wxFilePath = wx.getStorageSync(thumb)
          // if (wxFilePath) item.thumb = wxFilePath
          // else 
          item.thumb = thumb;
          item.loaded = false
        })

        var article = res.data.data.description.replace(/\/kaaction/g, that.data.image + "/kaaction")
        article = article.replace(/&amp;/g, "&");
        article = article.replace(/&quot;/g, "\"");
        article = article.replace(/&lt;/g, "<");
        article = article.replace(/&gt;/g, ">");
        WxParse.wxParse('article2', 'html', article, that, 5);

        that.setData({
          imgList: imgLoadList,
          productname: res.data.data.name,
          productprice: res.data.data.listColor[0].price,
          description: article,
          productnumber: res.data.data.code,
          brandname: res.data.data.brandName,
          productcolor: res.data.data.listColor,
          productsize: res.data.data.listSize,
          parameterother: res.data.data.listAttr,
          spuId: res.data.data.id,
          colormatchsize: res.data.data.listSku,
          label: res.data.data.listTag
        })
        if (that.data.label.length > 0) {
          if (that.data.label[0]) {
            that.setData({
              firstlabelid: that.data.label[0].id,
              firstlabelname: that.data.label[0].name,
              labelfirstshow: false
            })
          } else {
            that.setData({
              labelfirstshow: true
            })
          }
          if (that.data.label[1]) {
            that.setData({
              secondlabelid: that.data.label[1].id,
              secondlabelname: that.data.label[1].name,
              labelsecondshow: false
            })
          } else {
            that.setData({
              labelsecondshow: true
            })
          }
          if (that.data.label[2]) {
            that.setData({
              thirdlabelid: that.data.label[2].id,
              thirdlabelname: that.data.label[2].name,
              labelthirdshow: false
            })
          } else {
            that.setData({
              labelthirdshow: true
            })
          }
        } else {
          that.setData({
            labelfirstshow: true,
            labelsecondshow: true,
            labelthirdshow: true
          })
        }
      }
    })
  },
  // 标签页点击跳转
  labelfirstid: function (event) {
    var labelid = event.currentTarget.dataset.firstlabelid;
    var labelname = event.currentTarget.dataset.firstlabelname;
    wx.redirectTo({
      url: '../label/label?id=' + labelid + '&name=' + labelname,
    })
  },
  labelsecondid: function (event) {
    var labelid = event.currentTarget.dataset.secondlabelid;
    var labelname = event.currentTarget.dataset.secondlabelname;
    wx.redirectTo({
      url: '../label/label?id=' + labelid + '&name=' + labelname,
    })
  },
  labelthirdid: function (event) {
    var labelid = event.currentTarget.dataset.thirdlabelid;
    var labelname = event.currentTarget.dataset.thirdlabelname;
    wx.redirectTo({
      url: '../label/label?id=' + labelid + '&name=' + labelname,
    })
  },
  changeimg: function (event) {
    var that = this;
    if (event.detail.current == 0) {
      setTimeout(function () {
        if (that.data.label.length > 0) {
          if (that.data.label[0]) {
            that.setData({
              labelfirstshow: false
            })
          } else {
            that.setData({
              labelfirstshow: true
            })
          }
          if (that.data.label[1]) {
            that.setData({
              labelsecondshow: false
            })
          } else {
            that.setData({
              labelsecondshow: true
            })
          }
          if (that.data.label[2]) {
            that.setData({
              labelthirdshow: false
            })
          } else {
            that.setData({
              labelthirdshow: true
            })
          }
        } else {
          that.setData({
            labelfirstshow: true,
            labelsecondshow: true,
            labelthirdshow: true
          })
        }
      }, 1000)
    } else {
      that.setData({
        labelfirstshow: true,
        labelsecondshow: true,
        labelthirdshow: true
      })
    }
  },
  // 详情页展示
  todetails: function () {
    this.setData({
      parametercontent: true,
      detailscontent: false,
      position: 0
    })
  },
  // 参数页展示
  toparameter: function () {
    this.setData({
      parametercontent: false,
      detailscontent: true,
      position: 1
    })
  },
  //跳转至首页
  tohome: function () {
    wx.switchTab({
      url: '../index/index',
    })
  },
  //跳转至购物车
  toshopcar: function () {
    wx.switchTab({
      url: '../shopcar/shopcar',
    })
  },
  // 选中颜色改变
  changecolorstyle: function (e) {
    var that = this
    var whichcolor = e.currentTarget.dataset.hi
    var whichcolorname = e.currentTarget.dataset.colorname
    var arrsize = []
    var w = -1
    // 选中颜色对应的尺码
    for (var m in that.data.colormatchsize) {
      if (that.data.colormatchsize[m].colorName == whichcolorname) {
        w = w + 1
        arrsize[w] = new Object;
        arrsize[w].sizeName = that.data.colormatchsize[m].colorSize;
        arrsize[w].sizeId = that.data.colormatchsize[m].sizeId;
      }
    }
    console.log(arrsize)
    this.setData({
      productsize: arrsize,
      checked: !this.data.checked,
      whichcolor: whichcolor,
      whichcolorname: whichcolorname
    })
  },
  changesizestyle: function (e) {
    var that = this
    var whichsize = e.currentTarget.dataset.hi
    var whichsizename = e.currentTarget.dataset.sizename
    var arrcolor = []
    var t = -1
    // 选中尺码对应的颜色
    for (var n in that.data.colormatchsize) {
      if (that.data.colormatchsize[n].colorSize == whichsizename) {
        t = t + 1
        arrcolor[t] = new Object;
        arrcolor[t].colorName = that.data.colormatchsize[n].colorName;
        arrcolor[t].colorId = that.data.colormatchsize[n].colorId;
      }
    }
    console.log(arrcolor)
    this.setData({
      productcolor: arrcolor,
      choosed: !this.data.choosed,
      whichsize: whichsize,
      whichsizename: whichsizename
    })
  },
  // 购买数量改变
  reduce: function () {
    var reducenumber = this.data.buynumber;
    if (reducenumber > 1) {
      reducenumber = reducenumber - 1;
    } else {
      reducenumber = 1;
    }
    this.setData({
      buynumber: reducenumber
    })
  },
  add: function () {
    var addnumber = this.data.buynumber;
    addnumber = addnumber + 1;
    this.setData({
      buynumber: addnumber
    })
  },
  // 选择商品属性的弹框
  close: function () {
    this.setData({
      modal: true
    })
  },
  //立即购买
  buynow: function () {
    this.setData({
      modal: false,
      buyorcar: 'buy'
    })
  },
  // 添加到购物车
  addshopcar: function () {
    this.setData({
      modal: false,
      buyorcar: 'car'
    })
  },
  //商品确定
  choosesure: function () {
    var that = this
    var openId = wx.getStorageSync('openId');
    this.setData({
      openId: openId,
    })
    if (that.data.buyorcar == 'car') {
      wx.request({
        url: host + '/cart/add',
        header: { 'content-type': 'application/json' },
        data: {
          openId: openId,
          productNum: this.data.buynumber,
          spuId: this.data.spuId,
          productSaleAttrSplitWithComma: this.data.whichcolor + ',' + this.data.whichsize
        },
        success: function (res) {
          if (res.data.err_code == 'success') {
            wx.showToast({
              title: '添加成功',
              icon: 'success',
              duration: 2000
            })
            that.setData({
              modal: true
            })
          } else {
            wx.showToast({
              title: '请选择分类及尺码',
              icon: 'success',
              duration: 2000
            })
          }
        }
      })
    } else if (that.data.buyorcar == 'buy') {
      if (that.data.whichcolor && that.data.whichsize) {
        that.setData({
          modal: true
        })
        wx.navigateTo({
          url: '../ordersure/wedbuyordersure?id=' + that.data.spuId + '&buynumber=' + that.data.buynumber + '&whichcolor=' + that.data.whichcolor + '&whichsize=' + that.data.whichsize + '&whichcolorname=' + that.data.whichcolorname + '&whichsizename=' + that.data.whichsizename
        })
      } else {
        wx.showToast({
          title: '请选择分类及尺码',
          icon: 'success',
          duration: 2000
        })
      }

    }

  },
  //加载完成后的回调
  imageOnLoad: function (err, data) {
    console.log('调用本地的callback方法：' + data.src)
    var that = this

    const imgList = that.data.imgList.map(item => {
      if (item.url == data.src) {
        item.loaded = true
        console.log("找到本地的对应图片" + data.src)
      }
      return item
    })
    this.setData({ imgList: imgList })
  }
})